<template>
  <div>
    <!-- 索赔扣款信息查询-详情页面 -->
    <BreakSpace label="索赔扣款基本信息" :containerStyle="{ marginBottom: '10px' }" />
    <FormPanel ref="formPanel1" :list="formList" :cols="3" :formType="'add'" labelWidth="110" :isSubmitBtn="false" @formChange="formChangeHandle" />
    <BreakSpace label="维修项目列表" :containerStyle="{ marginBottom: '10px' }" />
    <FilterTable
      ref="weixiuxiangmutable"
      :columns="columns"
      :params="fetchParams"
      :dataSource="dataList"
      :datakey="'items'"
      :onColumnsChange="columns => (this.columns = columns)"
      :onRowSelectChange="selectChange"
      :isSelectColumn="false"
      :isPagination = false
      height="auto"
    >
    </FilterTable>
    <div style="margin-bottom: 1rem;"></div>
    <!-- 配件换上件列表 -->
    <BreakSpace label="配件换上件列表" :containerStyle="{ marginBottom: '10px' }" />
    <FilterTable
      ref="peijianhuanshangjiantable"
      :columns="columns1"
      :params="fetchParams"
      :dataSource="dataList1"
      :datakey="'items'"
      :onColumnsChange="columns => (this.columns = columns)"
      :onRowSelectChange="selectChange"
      :isSelectColumn="false"
      :isPagination = false
      height="auto"
    >

    </FilterTable>
    <!-- 配件换下件列表 -->
    <BreakSpace label="配件换下件列表" :containerStyle="{ marginBottom: '10px' }" />
    <FilterTable
      ref="peijianhuanxiajiantable"
      :columns="columnshuanxiajian"
      :params="fetchParams"
      :dataSource="huanxiajiandataList"
      :datakey="'items'"
      :onColumnsChange="columns => (this.columns = columns)"
      :onRowSelectChange="selectChange"
      :isSelectColumn="false"
      :isPagination = false
      height="auto"
    >
    </FilterTable>
    <!-- 附加项目列表 -->
    <BreakSpace label="附加项目列表" :containerStyle="{ marginBottom: '10px' }" />
    <FilterTable
      ref="fujiaxiangmutable"
      :columns="columnsfujiaxiangmu"
      :params="fetchParams"
      :dataSource="fujiaxiangmudataList"
      :datakey="'items'"
      :onColumnsChange="columns => (this.columns = columns)"
      :onRowSelectChange="selectChange"
      :isSelectColumn="false"
      :isPagination = false
      height="auto"
    >
    </FilterTable>
    <!--申请费用信息  -->
    <BreakSpace label="申请费用信息" :containerStyle="{ marginBottom: '10px' }" />
    <FormPanel ref="formPanel2" :list="shenqingfeiyongformList" :cols="4" :formType="'add'" labelWidth="110" :isSubmitBtn="false" />
    <BreakSpace label="外出救援费用" :containerStyle="{ marginBottom: '10px' }" />
    <FormPanel ref="formPanelOutAmount" :list="outAmountformList" :cols="5" :formType="'add'" labelWidth="110" @formChange="formChangeHandleOutAmount" :isSubmitBtn="false" />

    <!--审核费用信息  -->
    <BreakSpace label="审核费用信息" :containerStyle="{ marginBottom: '10px' }" />
    <FormPanel ref="formPanel3" :list="shenhefeiyongformList" :cols="4" :formType="'add'" labelWidth="110" :isSubmitBtn="false" />
    <!--扣款信息  -->
    <BreakSpace label="扣款信息" :containerStyle="{ marginBottom: '10px' }" />
    <FormPanel ref="formPanel4" :list="koukuanfeiyongformList" :cols="4" :formType="'add'" labelWidth="110" :isSubmitBtn="false" />
    <!--    <LazyLoadTab v-model="activeName" :tabMenus="menus"></LazyLoadTab>-->
    <div style="padding-top: 3rem;"></div>
    <div
      :style="{
        position: 'absolute',
        left: 0,
        bottom: 0,
        right: 0,
        zIndex: 9,
        borderTop: '1px solid #e9e9e9',
        padding: '10px 20px',
        background: '#fff',
        textAlign: 'right'
      }"
    >

      <multiuse-button type="primary" @click="closeDialog">关 闭</multiuse-button>
    </div>
  </div>
</template>
<script>
  import { queryRpCmsClaimCb,edit } from '@/api/claim/factory/ClaimDebitsInfoMaintain';
  import { isFormEmpty } from '@/utils/index';
  import { dictionary } from '@/utils/dictMixin';
  import { cmsClaimTypeStr}  from '@/api/claim/dealer/ClaimApplication/index';
  export default {
    mixins: [dictionary],
    props: ['rowData', 'editIds'],
    data() {
      return {
        index: 0,
        dataList: [],
        dataList1: [],
        huanxiajiandataList: [],
        fujiaxiangmudataList: [],
        visible: false,
        visibleDrawer: false,
        collapse: false,
        infoId: null,
        flterValue: {}, //参数
        columns: this.creatHeader(),
        columns1: this.creatHeader1(),
        columnshuanxiajian: this.columnshuanxiajian1(),
        columnsfujiaxiangmu: this.columnsfujiaxiangmu1(),
        fetchParams: {}, //ipa 接口
        selectedRows: [], //选中经销商
        formList: this.createFormList(),
        outAmountformList: this.outAmountformListFn(),
        shenqingfeiyongformList: this.shenqingfeiyong(),
        shenhefeiyongformList: this.shenhefeiyong(),
        koukuanfeiyongformList: this.koukuanxinxi(),
        saveData: null
      };
    },
    async created() {
      await this.chuqi();
        await this.getRpCmsClaimCb(this.rowData.cbId);
    },
    mounted() {
    },
    methods: {
      async chuqi() {
        //索赔类型
        const res1 = await cmsClaimTypeStr({ type: 5510 });
        if (res1.resultCode == 200) {
          this.formList.find(x => x.fieldName == 'claimType').itemList = res1.data.map(y => ({ text: y.codeCnDesc, value: y.codeId }));
        }
        // const res5 = await getPartType( {type:5585});
        // this.columnshuanxiajian.find((x) => x.dataIndex === 'returnType').dictItems = res5.data.map((x) => ({
        //   value: x.codeId + '',
        //   text: x.codeCnDesc,
        // }));
      },
      async getRpCmsClaimCb(cbId) {
        let res = await queryRpCmsClaimCb(cbId);
        let data = res.data;
        //为4个form赋值
        for (let i in data) {
          this.formList.map(y => {
            if (i == y.fieldName) {
              y.initialValue = data[i];
            }
          });
        }
        for (let i in data.claimDTO) {
          this.shenqingfeiyongformList.map(y => {
            if (i == y.fieldName) {
              y.initialValue = data.claimDTO[i];
            }
          });
          this.shenhefeiyongformList.map(y => {
            if (i == y.fieldName) {
              y.initialValue = data.claimDTO[i];
            }
          });
          this.koukuanfeiyongformList.map(y => {
            if (i == y.fieldName) {
              y.initialValue = data.claimDTO[i];
            }
          });
        }
        //为table赋值
        if (200 == res.resultCode) {
          let data = res.data;
          if (isFormEmpty(data)) {
            data = {};
          }
          //维修项目
          let records = data.labourList;
          if (isFormEmpty(records)) {
            records = [];
          }
          this.$refs.weixiuxiangmutable.$refs.pageTable.EXECUTE_DELETE(this.$refs.weixiuxiangmutable.$refs.pageTable.list);
          this.$refs.weixiuxiangmutable.$refs.pageTable.EXECUTE_INSERT(records);
          //附加项目
          let records1 = data.addList;
          if (isFormEmpty(records1)) {
            records1 = [];
          }
          this.$refs.fujiaxiangmutable.$refs.pageTable.EXECUTE_DELETE(this.$refs.fujiaxiangmutable.$refs.pageTable.list);
          this.$refs.fujiaxiangmutable.$refs.pageTable.EXECUTE_INSERT(records1);
        }
        //配件换下件
        let records2 = data.partList;
        if (isFormEmpty(records2)) {
          records2 = [];
        }
        this.$refs.peijianhuanxiajiantable.$refs.pageTable.EXECUTE_DELETE(this.$refs.peijianhuanxiajiantable.$refs.pageTable.list);
        this.$refs.peijianhuanxiajiantable.$refs.pageTable.EXECUTE_INSERT(records2);
        //配件换上件
        let records3 = data.partRList;
        if (isFormEmpty(records3)) {
          records3 = [];
        }
        this.$refs.peijianhuanshangjiantable.$refs.pageTable.EXECUTE_DELETE(this.$refs.peijianhuanshangjiantable.$refs.pageTable.list);
        this.$refs.peijianhuanshangjiantable.$refs.pageTable.EXECUTE_INSERT(records3);
      },
      async tongGuo() {
        this.saveFlag = 0;
        this.saveDialog();
      },
      formChangeHandle(val) {
        console.log(val);
        this.saveData = val;
      },
      //搜索获取数据
      changeHandle(val) {
        this.fetchParams = Object.assign({}, this.fetchParams, val);
        console.log(val);
      },
      //选中
      selectChange(rows) {
        this.selectedRows = rows;
        console.log(this.selectedRows);
      },
      //保存
      async saveDialog() {
        this.$refs.formPanel1.SUBMIT_FORM();
        this.$refs.formPanel2.SUBMIT_FORM();
        this.$refs.formPanel3.SUBMIT_FORM();
        this.$refs.formPanel4.SUBMIT_FORM();
        let arr = [];
        this.$refs.fujiaxiangmutable.$refs.pageTable.list.map(x => {
          arr.push(x);
        });
        console.log(arr);

        let arr1 = [];
        this.$refs.peijianhuanxiajiantable.$refs.pageTable.list.map(x => {
          arr1.push(x);
        });
        console.log(arr1);

        let arr2 = [];
        this.$refs.peijianhuanshangjiantable.$refs.pageTable.list.map(x => {
          arr2.push(x);
        });
        console.log(arr2);

        let arr3 = [];
        this.$refs.weixiuxiangmutable.$refs.pageTable.list.map(x => {
          arr3.push(x);
        });
        console.log(arr3);

        //维修项目
        this.saveData.labourList = arr3;
        //换上件
        this.saveData.partRList = arr2;
        //换下件
        this.saveData.partList = arr1;
        //附加项目
        this.saveData.addList = arr;

        this.saveData = Object.assign(this.saveData, this.saveData1);

        this.saveData = Object.assign(this.saveData, this.saveData2);

        this.saveData = Object.assign(this.saveData, this.saveData3);

        this.saveData = Object.assign(this.saveData, this.saveData4);
        console.info(this.saveData);

        //追加子表的主键
        if(this.claimId!=null){
          this.saveData.claimId = this.claimId;
        }else{
          this.saveData.claimId = this.rowData.claimId;
        }
        this.saveData.isDeleted = this.rowData.isDeleted
        this.saveData.cbId = this.rowData.cbId;
        if (this.saveFlag == 0) {
          this.saveData.cbStatus = 55911001;
        }

        if (this.saveData !== null) {
          let res = await edit(this.saveData);
          if (res.resultCode == 200) {
            if(this.editIds.length){
              this.editIds[this.index].status = 1;
              this.next();
            } else {
              this.$emit('save');
            }
          }
          // if (res.resultCode === 200) {
          //   this.closeDialog('refresh');
          //   return this.$notify.success({ title: '提示信息', message: '保存成功' });
          //   this.$emit('save');
          // } else {
          //   this.$notify.error({ title: '提示信息', message: res.errMsg || '保存失败!' });
          //   this.closeDialog();
          // }

        }else {
          return this.$notify.warning({ title: '提示信息', message: '有未校验通过的信息' });
        }


      },
      //取消操作
      closeDialog() {
        this.$emit('close', { visible: false, data: this.selectedRows, type: 'close' });
      },
      chooseOrderNo() {
        this.visible = true;
      },
      add() {},
      createFormList() {
        return [
          {
            type: 'INPUT',
            label: '索赔扣款单号',
            fieldName: 'cbNo',
            initialValue: '',
            disabled: true
          },
          {
            type: 'INPUT',
            label: '服务站代码',
            fieldName: 'ownerCode',
            initialValue: '',
            disabled: true
          },
          {
            type: 'INPUT',
            label: '服务站名称',
            fieldName: 'ownerName',
            initialValue: '',
            disabled: true
          },
          {
            type: 'SELECT',
            label: '扣款单状态',
            fieldName: 'cbStatus',
            initialValue: '',
            itemList: this.createDictList('5502'),
            disabled: true
          },
          {
            type: 'INPUT',
            label: '索赔号',
            fieldName: 'claimNo',
            initialValue: '',
            placeholder: '请输入标题名称...',
            rules: [{ required: true, message: '请输入标题名称', trigger: 'blur' }],
            readonly: true,
            disabled: true,
            unitRender: p => {
              return (
                <div>
                  <multiuse-button icon="el-icon-search" onClick={() => this.selectRono()} />
                </div>
              );
            }
          },
          {
            type: 'INPUT',
            label: '扣款原因',
            fieldName: 'cbReason',
            disabled: true,
            rules: [{ required: true, message: '请输入扣款原因', trigger: 'change' }],

          },
          // {
          //   type: 'SELECT',
          //   label: '扣款类型',
          //   fieldName: 'cbType',
          //   rules: [{ required: true, message: '请选择扣款类型', trigger: 'blur' }],
          //   itemList: this.createDictList('5511'),
          //   change: (val) => {
          //     if (val == 55111003) {
          //         this.formList.map((y) => {
          //           if (y.fieldName == 'remarks') {
          //             y.rules[0].required=true;
          //           }
          //       })
          //   }else{
          //       this.formList.map((y) => {
          //         if (y.fieldName == 'remarks') {
          //           y.rules[0].required=false;
          //         }
          //       })
          //     }
          //   }
          // },
          {
            type: 'SELECT',
            label: '索赔类型',
            fieldName: 'claimType',
            itemList: [],
            disabled: true
          },
          {
            type: 'INPUT',
            label: '现结算金额',
            fieldName: 'finalSumAmount',
            initialValue: '',
            hidden:true,
            disabled: true
          },
          {
            type: 'TEXT_AREA',
            label: '备注',
            fieldName: 'remarks',
            selfCols:3,
            disabled: true,
            placeholder: '请输入数量...',
            rules: [{ required: false, message: '请输入', trigger: 'blur' }]
          }
        ];
      },

      //table表头和数据源
      creatHeader() {
        return [
          {
            title: '序号',
            dataIndex: 'index',
            width: 80,
            sorter: true,
            render: props => {
              return <span>{props.row.index + 1}</span>;
            }
          },
          { title: '维修项目代码', dataIndex: 'labourCode', sorter: true },
          { title: '维修项目名称', dataIndex: 'labourName', sorter: true },
          { title: '维修类型', dataIndex: 'cmsClaimType', sorter: true },
          { title: '标准工时', dataIndex: 'labourHours', sorter: true },
          { title: '索赔工时单价', dataIndex: 'cmsClaimPrice', sorter: true },
          { title: '索赔金额', dataIndex: 'cmsClaimAmount', sorter: true },
          {
            title: '扣款金额',
            dataIndex: 'deductionAmount',
            filterType: 'input',
          },
        ];
      },
      //table表头和数据源
      creatHeader1() {
        return [
          {
            title: '序号',
            dataIndex: 'index',
            width: 80,
            sorter: true,
            render: props => {
              return <span>{props.row.index + 1}</span>;
            }
          },
          { title: '配件代码', dataIndex: 'partCode', sorter: true },
          { title: '配件名称', dataIndex: 'partName', sorter: true },
          { title: '单位', dataIndex: 'partUnit', sorter: true },
          { title: '数量', dataIndex: 'partCount', sorter: true },
          { title: '索赔单价', dataIndex: 'cmsClaimPrice', sorter: true },
          { title: '索赔总价', dataIndex: 'cmsClaimAmount', sorter: true },
          {
            title: '扣款金额',
            dataIndex: 'deductionAmount',
            filterType: 'input',
          },
        ];
      },
      //换下件
      columnshuanxiajian1() {
        return [
          {
            title: '序号',
            dataIndex: 'index',
            width: 80,
            sorter: true,
            render: props => {
              return <span>{props.row.index + 1}</span>;
            }
          },
          { title: '配件代码', dataIndex: 'partCode', sorter: true },
          { title: '配件名称', dataIndex: 'partName', sorter: true },
          { title: '单位', dataIndex: 'partUnit', sorter: true },
          { title: '数量', dataIndex: 'partCount', sorter: true },
          { title: '配件回运类型', dataIndex: 'returnType', sorter: true , dictItems:this.createDictList('5585')}
        ];
      },
      //附加项目
      columnsfujiaxiangmu1() {
        return [
          {
            title: '序号',
            dataIndex: 'index',
            width: 80,
            sorter: true,
            render: props => {
              return <span>{props.row.index + 1}</span>;
            }
          },
          { title: '附加项目代码', dataIndex: 'addCode', sorter: true },
          { title: '附加项目名称', dataIndex: 'addName', sorter: true },
          { title: '申请金额', dataIndex: 'addAmount', sorter: true },
          { title: '审核金额', dataIndex: 'checkAmount', sorter: true },
          {
            title: '扣款金额',
            dataIndex: 'deductionAmount',
            filterType: 'input',
          },
          { title: '备注', dataIndex: 'remarks', sorter: true }
        ];
      },
      //外出救援费用
      outAmountformListFn() {
        return [
          {
            type: 'INPUT',
            label: '燃油补贴',
            fieldName: 'fuel',
            initialValue: 0,
            readonly: true // 只读
          },
          {
            type: 'INPUT',
            label: '人员补贴',
            fieldName: 'pr',
            initialValue: 0,
            readonly: true // 只读
          },
          {
            type: 'INPUT',
            label: '餐补',
            fieldName: 'food',
            initialValue: 0,
            readonly: true // 只读
          },
          {
            type: 'INPUT',
            label: '住宿补贴',
            fieldName: 'stay',
            initialValue: 0,
            readonly: true // 只读
          },
          {
            type: 'INPUT',
            label: '车船费',
            fieldName: 'cross',
            initialValue: 0,
            readonly: true // 只读
          },
          {
            type: 'INPUT',
            label: '拖车费',
            fieldName: 'trailer',
            initialValue: '',
            readonly: true // 只读
          },
          {
            type: 'INPUT',
            label: '其他费用',
            fieldName: 'other',
            initialValue: '',
            readonly: true // 只读
          },
          {
            type: 'INPUT',
            label: '激励类型',
            fieldName: 'rewardType',
            initialValue: '',
            readonly: true // 只读
          },
          {
            type: 'INPUT',
            label: '奖励金额',
            fieldName: 'reward',
            initialValue: '',
            readonly: true // 只读
          }
        ];
      },
      //申请费用信息
      shenqingfeiyong() {
        return [
          {
            type: 'INPUT',
            label: '合计费用',
            fieldName: 'sumAmount',
            initialValue: 0,
            readonly: true // 只读
          },
          {
            type: 'INPUT',
            label: '工时费用',
            fieldName: 'labourAmount',
            initialValue: 0,
            readonly: true // 只读
          },
          {
            type: 'INPUT',
            label: '配件费用',
            fieldName: 'partAmount',
            initialValue: 0,
            readonly: true // 只读
          },
          {
            type: 'INPUT',
            label: '附加项目费用',
            fieldName: 'addAmount',
            initialValue: 0,
            readonly: true // 只读
          },
          {
            type: 'INPUT',
            label: '外出救援费用',
            fieldName: 'helpAmount',
            initialValue: 0,
            readonly: true // 只读
          }
        ];
      },//审核费用信息
      shenhefeiyong() {
        return [
          {
            type: 'INPUT',
            label: '合计费用',
            fieldName: 'claimSumAmount',
            initialValue: 0,
            readonly: true // 只读
          },
          {
            type: 'INPUT',
            label: '工时费用',
            fieldName: 'claimLabourAmount',
            initialValue: 0,
            readonly: true // 只读
          },
          {
            type: 'INPUT',
            label: '配件费用',
            fieldName: 'claimPartAmount',
            initialValue: 0,
            readonly: true // 只读
          },
          {
            type: 'INPUT',
            label: '附加项目费用',
            fieldName: 'claimAddAmount',
            initialValue: 0,
            readonly: true // 只读
          },
          {
            type: 'INPUT',
            label: '外出救援费用',
            fieldName: 'helpAmount',
            initialValue: 0,
            readonly: true // 只读
          }
        ];
      },//扣款信息
      koukuanxinxi() {
        return [
          {
            type: 'INPUT',
            label: '合计扣款',
            fieldName: 'cbSumAmount',
            initialValue: 0,
            readonly: true // 只读
          },
          {
            type: 'INPUT',
            label: '工时扣款',
            fieldName: 'cbLabourAmount',
            initialValue: 0,
            readonly: true // 只读
          },
          {
            type: 'INPUT',
            label: '配件扣款',
            fieldName: 'cbPartAmount',
            initialValue: 0,
            readonly: true // 只读
          },
          {
            type: 'INPUT',
            label: '附加项目扣款',
            fieldName: 'cbAddAmount',
            initialValue: 0,
            readonly: true // 只读
          }
        ];
      }
    }
  };
</script>

<style lang="less" scoped></style>
